define(['jquery', 'bootstrap', 'backend', 'table', 'form', 'xyvenue_vue'], function ($, undefined, Backend, Table, Form,Vue) {

    var Controller = {
        index: function () {
            // 初始化表格参数配置
            Table.api.init({
                extend: {
                    index_url: 'xyvenue/package/index' + location.search,
                    add_url: 'xyvenue/package/add',
                    edit_url: 'xyvenue/package/edit',
                    del_url: 'xyvenue/package/del',
                    multi_url: 'xyvenue/package/multi',
                    import_url: 'xyvenue/package/import',
                    table: 'xyvenue_package',
                }
            });

            var table = $("#table");

            // 初始化表格
            table.bootstrapTable({
                url: $.fn.bootstrapTable.defaults.extend.index_url,
                pk: 'id',
                sortName: 'id',
                fixedColumns: true,
                fixedRightNumber: 1,
                columns: [
                    [
                        {checkbox: true},
                        {field: 'id', title: __('Id')},
                        {field: 'type', title: __('Type'), searchList: {"1":__('Type 1'),"2":__('Type 2')}, formatter: Table.api.formatter.normal},
                        {field: 'user.nickname',operate: 'LIKE', title: __('User_id'),formatter:function(v,row){
                                var html = '-';
                                if(v){
                                    html = '<div style="display:flex"><img width="50px" height="50px" src="'+row.user.avatar+'" /><p style="text-align:left;line-height:20px;margin-top:5px;margin-left:10px">ID:'+row.user.id+'<br/>'+v+'</p></div>';
                                }
                                return html;
                            }
                        },
                        {field: 'store.name', title: __('Store_id')},
                        {field: 'venue.name', title: __('Venue_id')},
                        {field: 'startdate', title: __('Startdate'), operate: 'LIKE'},
                        {field: 'enddate', title: __('Enddate'), operate: 'LIKE'},
                        {field: 'arealist', title: __('Area'), operate: 'LIKE', table: table, class: 'autocontent', formatter: Table.api.formatter.content},
                        {field: 'timelist', title: __('Time'), operate: 'LIKE', table: table, class: 'autocontent', formatter: Table.api.formatter.content},
                        {field: 'createtime', title: __('Createtime'), operate:'RANGE', addclass:'datetimerange', autocomplete:false, formatter: Table.api.formatter.datetime},
                        {field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate, formatter: Table.api.formatter.operate}
                    ]
                ]
            });

            //修改默认弹窗大小
            Fast.config.openArea = ['70%', '90%'];

            // 为表格绑定事件
            Table.api.bindevent(table);
        },
        add: function () {
            var package = new Vue({
                el: "#app",
                data() {
                    return {
                        type:1,
                        storeInfo:'',
                        venueInfo:'',
                        timeList:[],
                        areaList:[],
                    }
                },
                methods: {

                    //更改类型
                    changeType(){
                        this.type = parseInt($("#c-type").val());
                    },

                    //选择场馆
                    selectStore(){
                        var that = this;
                        parent.Fast.api.open("xyvenue/store/store/select?multiple=false", __('选择场馆'), {
                            area: ['80%', '80%'],
                            callback: function (data) {
                                that.storeInfo = data;
                            }
                        });
                    },

                    //选择场地
                    selectVenue(){
                        var that = this,storeInfo = this.storeInfo;
                        if(storeInfo == ''){
                            Toastr.error("请先选择场馆！");
                        }else{
                            parent.Fast.api.open("xyvenue/venue/select?store_id="+storeInfo.id+"&multiple=false", __('选择场地'), {
                                area: ['80%', '80%'],
                                callback: function (data) {
                                    that.venueInfo = data;
                                    that.setAreaList();
                                    that.setTimeList();
                                }
                            });
                        }
                    },

                    //生成区域
                    setAreaList(){
                        var area = this.venueInfo.area;
                        area.forEach((item,index)=>{
                            area[index]['isSelect'] = false;
                        });
                        this.areaList = area;
                    },

                    //选择区域
                    areaSelect(k){
                        var areaList = this.areaList;
                        areaList[k]['isSelect'] = ! areaList[k]['isSelect'];
                        Vue.set(this.areaList,k, areaList[k]);
                    },

                    //选择时段
                    timeSelect(k){
                        console.log(k);
                        var timeList = this.timeList;
                        timeList[k]['isSelect'] = ! timeList[k]['isSelect'];

                        console.log(timeList);

                        Vue.set(this.timeList,k, timeList[k]);
                    },
                    
                    //生成时段
                    setTimeList(){
                        var businesshours = this.storeInfo.businesshours;
                        var timeArr = businesshours.split('-');
                        var startTime = timeArr[0];
                        var endTime = timeArr[1];
                        var duration = parseInt(this.venueInfo.duration);
                        const start = new Date();
                        start.setHours( parseInt(startTime.split(':')[0]), parseInt(startTime.split(':')[1]), 0);
                        const end = new Date();
                        end.setHours( parseInt(endTime.split(':')[0]), parseInt(endTime.split(':')[1]), 0);
                        var tempTimeList = [];
                        while (start <= end) {
                            tempTimeList.push(start.toLocaleString('zh-CN', {hour: '2-digit', minute: '2-digit'}));
                            start.setMinutes(start.getMinutes() + duration);
                        }
                        var timeList = [];
                        for(var i = 0; i<tempTimeList.length-1;i++){
                            timeList.push({time:tempTimeList[i]+'-'+tempTimeList[i+1],isSelect:false});
                        }

                        console.log(timeList);

                        this.timeList = timeList;
                    },
                    
                },
                
            })

            Form.api.bindevent($("form[role=form]"), function(data, ret){
                console.log(data,ret);
            }, function(data, ret){
                console.log(data,ret);
            }, function(success, error){
                //提交之前设置数据
                var areaList = package.areaList;
                var selectAreaList = [];
                areaList.forEach((item,index)=>{
                    if(item.isSelect){
                        selectAreaList.push(item.name);
                    }
                });
                if(selectAreaList.length == 0){
                    Toastr.error("请选择包场区域");
                    return false;
                }

                var timeList = package.timeList;
                var selectTimeList = [];
                timeList.forEach((item,index)=>{
                    if(item.isSelect){
                        selectTimeList.push(item.time);
                    }
                });
                if(selectTimeList.length == 0){
                    Toastr.error("请选择包场时段");
                    return false;
                }

                $("#arealist").val(JSON.stringify(selectAreaList));
                $("#timelist").val(JSON.stringify(selectTimeList));

                Form.api.submit($("form[role=form]"), function (data, ret) {
                    setTimeout(function () {
                        parent.Layer.close(parent.Layer.getFrameIndex(window.name));
                        window.parent.location.reload();
                    }, 600);
                });

                return false;
            });
        },
        edit: function () {
            var package = new Vue({
                el: "#app",
                data() {
                    return {
                        type:Config.row.type,
                        storeInfo:Config.storeInfo,
                        venueInfo:Config.venueInfo,
                        timeList:[],
                        areaList:[],
                    }
                },
                mounted() {
                    this.setAreaList(Config.row.arealist);
                    this.setTimeList(Config.row.timelist);
                },
                methods: {

                    //更改类型
                    changeType(){
                        this.type = parseInt($("#c-type").val());
                    },

                    //选择场馆
                    selectStore(){
                        var that = this;
                        parent.Fast.api.open("xyvenue/store/select?multiple=false", __('选择场馆'), {
                            area: ['80%', '80%'],
                            callback: function (data) {
                                that.storeInfo = data;
                            }
                        });
                    },

                    //选择场地
                    selectVenue(){
                        var that = this,storeInfo = this.storeInfo;
                        if(storeInfo == ''){
                            Toastr.error("请先选择场馆！");
                        }else{
                            parent.Fast.api.open("xyvenue/venue/select?store_id="+storeInfo.id+"&multiple=false", __('选择场地'), {
                                area: ['80%', '80%'],
                                callback: function (data) {
                                    that.venueInfo = data;
                                    that.setAreaList();
                                    that.setTimeList();
                                }
                            });
                        }
                    },

                    //生成区域
                    setAreaList(s = []){
                        var area = this.venueInfo.area;
                        area.forEach((item,index)=>{
                            area[index]['isSelect'] = false;
                            s.forEach((item1,index1)=>{
                                if(item1 == item.name){
                                    area[index]['isSelect'] = true;
                                }
                            });
                        });
                        this.areaList = area;
                    },

                    //选择区域
                    areaSelect(k){
                        var areaList = this.areaList;
                        areaList[k]['isSelect'] = ! areaList[k]['isSelect'];
                        Vue.set(this.areaList,k, areaList[k]);
                    },

                    //选择时段
                    timeSelect(k){
                        var timeList = this.timeList;
                        timeList[k]['isSelect'] = ! timeList[k]['isSelect'];
                        Vue.set(this.timeList,k, timeList[k]);
                    },
                    
                    //生成时段
                    setTimeList(s = []){
                        var businesshours = this.storeInfo.businesshours;
                        var timeArr = businesshours.split('-');
                        var startTime = timeArr[0];
                        var endTime = timeArr[1];
                        var duration = parseInt(this.venueInfo.duration);
                        const start = new Date();
                        start.setHours( parseInt(startTime.split(':')[0]), parseInt(startTime.split(':')[1]), 0);
                        const end = new Date();
                        end.setHours( parseInt(endTime.split(':')[0]), parseInt(endTime.split(':')[1]), 0);
                        var tempTimeList = [];
                        while (start <= end) {
                            tempTimeList.push(start.toLocaleString('zh-CN', {hour: '2-digit', minute: '2-digit'}));
                            start.setMinutes(start.getMinutes() + duration);
                        }
                        var timeList = [];
                        for(var i = 0; i<tempTimeList.length-1;i++){

                            var isSelect = false;
                            var timestr = tempTimeList[i]+'-'+tempTimeList[i+1];
                            s.forEach((item1,index1)=>{
                                if(item1 == timestr){
                                    isSelect = true;
                                }
                            });

                            timeList.push({time:timestr,isSelect:isSelect});
                        }

                        this.timeList = timeList;
                    },
                    
                },
                
            })

            Form.api.bindevent($("form[role=form]"), function(data, ret){
                console.log(data,ret);
            }, function(data, ret){
                console.log(data,ret);
            }, function(success, error){
                //提交之前设置数据
                var areaList = package.areaList;
                var selectAreaList = [];
                areaList.forEach((item,index)=>{
                    if(item.isSelect){
                        selectAreaList.push(item.name);
                    }
                });
                if(selectAreaList.length == 0){
                    Toastr.error("请选择包场区域");
                    return false;
                }

                var timeList = package.timeList;
                var selectTimeList = [];
                timeList.forEach((item,index)=>{
                    if(item.isSelect){
                        selectTimeList.push(item.time);
                    }
                });
                if(selectTimeList.length == 0){
                    Toastr.error("请选择包场时段");
                    return false;
                }

                $("#arealist").val(JSON.stringify(selectAreaList));
                $("#timelist").val(JSON.stringify(selectTimeList));

                Form.api.submit($("form[role=form]"), function (data, ret) {
                    setTimeout(function () {
                        parent.Layer.close(parent.Layer.getFrameIndex(window.name));
                        window.parent.location.reload();
                    }, 600);
                });

                return false;
            });
        },
        api: {
            bindevent: function () {
                Form.api.bindevent($("form[role=form]"));
            }
        }
    };
    return Controller;
});
